<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    {{template "link/customer/link.html" . }}
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
</head>
<body>

{{template "link/customer/nav.html" . }}
{{template "link/customer/header.html" .}}
<div class="content content-nav-base shopcart-content">
    {{template "link/customer/navBar.html" .}}
    <div class="banner-bg w1200">
        <h3>夏季清仓</h3>
        <p>宝宝被子、宝宝衣服3折起</p>
    </div>
    <div class="cart w1200">
        <div class="cart-table-th">
            <div class="th th-chk">
                <div class="select-all">
                    <div class="cart-checkbox">
                        <input class="check-all check" id="allCheckked" type="checkbox" value="true">
                    </div>
                    <label>&nbsp;&nbsp;全选</label>
                </div>
            </div>
            <div class="th th-item">
                <div class="th-inner">
                    商品
                </div>
            </div>
            <div class="th th-price">
                <div class="th-inner">
                    单价
                </div>
            </div>
            <div class="th th-amount">
                <div class="th-inner">
                    数量
                </div>
            </div>
            <div class="th th-sum">
                <div class="th-inner">
                    小计
                </div>
            </div>
            <div class="th th-op">
                <div class="th-inner">
                    操作
                </div>
            </div>
        </div>
        <div class="OrderList">
            <div class="order-content" id="list-cont">
                {{range .ShopItems}}
                    <ul class="item-content layui-clear">
                        <li class="th th-chk">
                            <div class="select-all">
                                <div class="cart-checkbox">
                                    <input class="CheckBoxShop check" id="" type="checkbox" num="all" name="select-all"
                                           value="true">
                                </div>
                            </div>
                        </li>
                        <li class="th th-item">
                            <div class="item-cont">
                                <a href="javascript:;"><img src="/static/upload/good/{{.ShopCardGood.GoodUrl}}" alt=""></a>
                                <div class="text">
                                    <div class="title">{{.ShopCardGood.GoodName}}</div>
                                </div>
                            </div>
                        </li>
                        <li class="th th-price">
                            <span class="th-su">{{.ShopCardGood.GoodPrices}}</span>
                        </li>
                        <li class="th th-amount">
                            <div class="box-btn layui-clear">
                                <div class="less layui-btn">-</div>
                                <input type="text" hidden="hidden" value="{{.ShopCardId}}" class="shopId">
                                <input type="text" hidden="hidden" value="{{.ShopCardGood.GoodId}}" class="goodId">
                                <input type="text" hidden="hidden" value="{{.ShopCardGood.GoodStoreId}}" class="storeId">
                                <input class="Quantity-input" type="" name="" value="{{.ShopCardNumber}}"
                                       disabled="disabled">
                                <div class="add layui-btn">+</div>
                            </div>
                        </li>
                        <li class="th th-sum">
                            <span class="sum">{{.ShopSum}}</span>
                        </li>
                        <li class="th th-op">
                            <span class="dele-btn">删除</span>
                        </li>
                    </ul>
                {{end}}
            </div>
        </div>


        <div class="FloatBarHolder layui-clear">
            <div class="th th-chk">
                <div class="select-all">
                    <div class="cart-checkbox">
                        <input class="check-all check" id="" name="select-all" type="checkbox" value="true">
                    </div>
                    <label>&nbsp;&nbsp;已选<span class="Selected-pieces">0</span>件</label>
                </div>
            </div>
            <div class="th batch-deletion">
                <span class="batch-dele-btn">批量删除</span>
            </div>
            <div class="th Settlement">
                <button class="layui-btn" id="makeOrder">结算</button>
            </div>
            <div class="th total">
                <p>应付：<span class="pieces-total">0</span></p>
            </div>
        </div>
    </div>

</div>

<script type="text/javascript">
    layui.config({
        base: '/static/js/util/' //你存放新模块的目录，注意，不是layui的模块目录
    }).use(['mm', 'jquery', 'element', 'car'], function () {
        var mm = layui.mm, $ = layui.$, element = layui.element, car = layui.car;

        // 模版导入数据
        // var html = demo.innerHTML,
        // listCont = document.getElementById('list-cont');
        // mm.request({
        //   url: '../json/shopcart.json',
        //   success : function(res){
        //     listCont.innerHTML = mm.renderHtml(html,res)
        //     element.render();
        //     car.init()
        //   },
        //   error: function(res){
        //     console.log(res);
        //   }
        // })
        //

        car.init()

        function makeOrder() {
            var seleted = 0, price = 0;
            var result = ""
            var uls = document.getElementById('list-cont').getElementsByTagName('ul');//每一行
            for (var i = 0; i < uls.length; i++) {
                if (i != 0) {
                    result = result + "&"
                }
                if (uls[i].getElementsByTagName('input')[0].checked) {
                    var ItemNums = '"ItemNums":' + parseInt(uls[i].getElementsByClassName('Quantity-input')[0].value)
                    var ItemPrices = '"ItemPrices":' + parseFloat(uls[i].getElementsByClassName('th-su')[0].innerHTML)
                    var ItemGoodsId = '"ItemGoodsId":' + parseInt(uls[i].getElementsByClassName('goodId')[0].value)
                    var shopIdd = '"ShopId":' + parseInt(uls[i].getElementsByClassName('shopId')[0].value)
                    var storeId = '"ItemStoreId":' + parseInt(uls[i].getElementsByClassName('storeId')[0].value)
                }
                var item = "item={" + ItemNums + "," + ItemPrices + "," + ItemGoodsId + "," + shopIdd + "," + storeId + "}"
                result = result + item
            }
            var data1 = result
            $.ajax({
                url: "/customer/makeOrder",
                type: "post",
                data: data1,
                dataType: 'json',
                contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                success: function (res) {
                    if (res.Code == 0) {
                        $(location).attr('href', '/customer/orderEx?'+res.Data.url);
                    } else {
                        layer.alert(res.msg)
                    }
                }
            })
        }

        $("#makeOrder").click(function () {
             makeOrder();
        })


    });
</script>
</body>
</html>